import React, { useState, useEffect } from 'react';
import { Modal, Form, Input, InputNumber, Select, Spin, message } from 'antd';
import request from '@/utils/request';

const formItemLayout = {
  labelCol: {
    xs: { span: 24 },
    sm: { span: 6 },
  },
  wrapperCol: {
    xs: { span: 24 },
    sm: { span: 16 },
  },
};

function EditStatusFlow({ visiable, close, form, refresh, title, packageId, flowObj }) {
  const { getFieldDecorator } = form;

  const [loading, setLoading] = useState(false);
  const [result, setResult] = useState([[]]);

  async function init() {
    setLoading(true);
    if (title === 'add') {
      await Promise.all([
        request('pmc/pms/StaticDataController/getStaticAttr.do', {
          data: {
            busiObjNbr: 'PmOrderFlowDef',
            attrNbr: 'timeUnit',
          },
        }),
        request('pmc/pms/PmOrderFlowDefController/getNextVersion', {
          data: {
            packageId,
          },
        }),
      ])
        .then(res => {
          setResult(res);
          form.setFieldsValue({ version: res[1].data });
        })
        .finally(() => setLoading(false));
    } else {
      form.setFieldsValue({
        version: flowObj.version,
        limitValue: flowObj.limitValue,
        alertValue: flowObj.alertValue,
        timeUnit: flowObj.timeUnit,
      });
      await Promise.all([
        request('pmc/pms/StaticDataController/getStaticAttr.do', {
          data: {
            busiObjNbr: 'PmOrderFlowDef',
            attrNbr: 'timeUnit',
          },
        }),
      ])
        .then(res => {
          setResult(res);
        })
        .finally(() => setLoading(false));
    }
  }

  useEffect(() => {
    init();
  }, []);

  const onSubmit = () => {
    form.validateFields((err, value) => {
      if (err) return;
      setLoading(true);
      if (title === 'add') {
        request('pmc/pms/PmOrderFlowDefController/addVersion', {
          data: {
            ...value,
            packageId,
          },
        })
          .then(res => {
            if (res.success) {
              message.success('新增版本成功！');
              close();
              refresh();
            } else {
              message.error('新增版本失败！');
            }
          })
          .always(() => setLoading(false));
      } else {
        request('pmc/pms/PmOrderFlowDefController/updateTimeLimit', {
          data: {
            ...value,
            flowId: flowObj.flowId,
          },
        })
          .then(res => {
            if (res.success) {
              message.success('修改版本成功！');
              close();
              refresh();
            } else {
              message.error('修改版本失败！');
            }
          })
          .always(() => setLoading(false));
      }
    });
  };

  return (
    <Modal
      title={title === 'add' ? '新建版本' : '修改版本'}
      width="500px"
      destroyOnClose
      onCancel={close}
      visible={visiable}
      onOk={onSubmit}
    >
      <Spin spinning={loading}>
        <Form>
          <Form.Item label="版本号" {...formItemLayout}>
            {getFieldDecorator('version', {
              rules: [
                {
                  required: true,
                  message: '版本号',
                },
              ],
            })(<Input placeholder="请输入" disabled />)}
          </Form.Item>
          <Form.Item label="完成时限" {...formItemLayout}>
            {getFieldDecorator('limitValue')(
              <InputNumber style={{ width: '100%' }} allowClear placeholder="请输入" />
            )}
          </Form.Item>

          <Form.Item label="告警时限" {...formItemLayout}>
            {getFieldDecorator('alertValue')(
              <InputNumber style={{ width: '100%' }} allowClear placeholder="请输入" />
            )}
          </Form.Item>

          <Form.Item label="时间单位" {...formItemLayout}>
            {getFieldDecorator('timeUnit')(
              <Select allowClear placeholder="请选择">
                {result[0].map(item => {
                  return <Select.Option value={item.attrValue}>{item.attrValueName}</Select.Option>;
                })}
              </Select>
            )}
          </Form.Item>
        </Form>
      </Spin>
    </Modal>
  );
}

export default Form.create()(EditStatusFlow);
